<template>
    <!-- 站内信 -->
    <entity-manager
        :fields="fields"
        :queryFields="queryFields"
        apiPrefix="/sys/inbox-msg/mine"
        :tree="false"
        ref="entityManagerRef"
        :params="params"
        :withNew="false"
        :withDelete="false"
        :withEdit="false"
        operationsWidth="100px"
    >
        <template #buttons>
            <el-button type="primary" icon="Check" @click="setAllRead">全部已读</el-button>
        </template>
        <template #appendButtons="{ row }">
            <el-link type="primary" icon="check" @click="setRead(row)" :disabled="row.status == 1">已读</el-link>
        </template>
    </entity-manager>
</template>

<script setup>
import { ref } from "vue";

const fields = [
    { label: "标题", prop: "title", max: 255, required: true, width: "400px" },
    { label: "内容", prop: "content", max: 255, required: true },
    { label: "状态", prop: "status", needNew: false, converter: (val) => (val ? "已读" : "未读"), width: "100px" },
    { label: "阅读时间", prop: "readTime", needNew: false, width: "160px" },
    { label: "添加时间", prop: "createTime", width: "160px", system: true },
    { label: "修改时间", prop: "updateTime", width: "160px", system: true },
];
const queryFields = [
    { label: "关键字", prop: "key" },
    {
        label: "状态",
        prop: "status",
        type: "select",
        options: [
            { label: "未读", value: 0 },
            { label: "已读", value: 1 },
        ],
    },
];
const entityManagerRef = ref();
const params = ref({});

function reload() {
    entityManagerRef.value.reload();
}

function setAllRead() {
    app.https.get("/sys/inbox-msg/read-all").then(() => {
        app.success("操作成功");
        reload();
    });
}

function setRead(row) {
    app.https.get("/sys/inbox-msg/read", { id: row.id }).then(() => {
        app.success("操作成功");
        row.status = 1;
    });
}
</script>
